<?php
    use User\Model\NiudanModel;
?>
<style>
    .tools{margin: -20px -5px;}
    .tools a{background: white;border-radius: 3px;-webkit-border-radius: 3px;color: #858582;float: left;
        margin-left: 10px;padding: 10px;text-decoration: none;}
    .tools a:first-child{background-image: url('/Public/images/minus.png');background-repeat:no-repeat;background-position: 50% center;}
    .tools a:nth-child(2){margin-right: 20px;background-image: url('/Public/images/plus.png');background-repeat:no-repeat;background-position: 50% center;}
</style>
<div class="row">
    <div class="col-lg-12">
        <section class="panel">
            <header class="panel-heading">
                奖项设置
            </header>
            <div class="panel-body">
                <form class="form-horizontal" method="post" action="/User/Niudan/prize" enctype="multipart/form-data" onsubmit="return checkPrize()">
                    <input type="hidden" name="id" value="{$id}">
                    <input type="hidden" name="update" value="true">
                    <section class="panel">
                        <header class="panel-heading custom-tab">
                            <ul class="nav nav-tabs" id="prize_tab">
                                <li class="active" data-id="1">
                                    <a href="#prize1" data-item="" data-toggle="tab">奖项1</a>
                                </li>
                                <volist name="prizes" id="item" offset="1">
                                    <li data-id="{$i+1}">
                                        <a href="#prize{$i+1}" data-item="{$item['id']}" data-toggle="tab">奖项{$i+1}</a>
                                    </li>
                                </volist>
                            </ul>
                            <empty name="prizes">
                                <input type="hidden" name="prize_num" value="1">
                            <else/>
                                <input type="hidden" name="prize_num" value="{$prizes|count}">
                            </empty>
                            <span class="tools pull-right">
                                <a class="" href="javascript:;" onclick="deletePrize();"></a>
                                <a class="" href="javascript:;" onclick="addPrize();"></a>
                            </span>
                        </header>
                        <div class="panel-body">
                            <div class="tab-content" id="prize_content">
                                <div class="tab-pane active" id="prize1">
                                    <input type="hidden" class="prize_item1" name="item_id1" value="{$prizes[0]['id']}">
                                    <div class="form-group">
                                        <label class="col-xs-12 col-sm-3 col-md-2 control-label"><span style="color:red">*</span>奖项等级</label>
                                        <div class="col-sm-6 col-xs-12">
                                            <div class="form-control-static">
                                                <select name="level1" class="form-control prize_level1">
                                                    <volist name="levels" id="level">
                                                        <option value="{$i}" <if condition="$i eq $prizes[0]['level']">selected</if>>{$level}</option>
                                                    </volist>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-lg-2 col-sm-2 control-label"><span style="color:red">*</span>奖项名称</label>
                                        <div class="col-lg-6">
                                            <input class="form-control required prize_name1" title="请输入奖项名称" name="name1" value="{$prizes[0]['name']}">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-lg-2 col-sm-2 control-label"><span style="color:red">*</span>奖项数量</label>
                                        <div class="col-lg-6">
                                            <input class="form-control required prize_number1" title="请输入奖项数量" name="number1" value="{$prizes[0]['number']}">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-lg-2 col-sm-2 control-label"><span style="color:red">*</span>中奖概率(0.00001-100.00000)</label>
                                        <div class="col-lg-6">
                                            <input class="form-control required prize_rate1" title="请输入中奖概率" name="reserve1" value="{$prizes[0]['reserve']}">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-lg-2 col-sm-2 control-label"><span style="color:red">*</span>奖项图片</label>
                                        <div class="col-lg-6">
                                            <img src="{$prizes[0]['pic']}" class="prize_img1" width="100px" height="100px" data-preview="uploadFile1">
                                            <input name="picurl1" type="file" data-action="uploadFile1" class="prize_file1">
                                            <if condition="$prizes[0]['pic'] neq null">
                                                <input type="hidden" class="prize_pic1" name="picurl1" value="{$prizes[0]['pic']}" data-set="uploadFile1">
                                            </if>
                                        </div>
                                    </div>
                                </div>
                                <volist name="prizes" id="item" offset="1" key="k">
                                    <div class="tab-pane" id="prize{$k+1}">
                                        <input type="hidden" class="prize_item{$k+1}" name="item_id{$k+1}" value="{$item['id']}">
                                        <div class="form-group">
                                            <label class="col-xs-12 col-sm-3 col-md-2 control-label"><span style="color:red">*</span>奖项等级</label>
                                            <div class="col-sm-6 col-xs-12">
                                                <div class="form-control-static">
                                                    <select name="level{$k+1}" class="form-control prize_level{$k+1}">
                                                        <volist name="levels" key="key_level" id="level">
                                                            <option value="{$key_level}" <if condition="$key_level eq $item['level']">selected</if>>{$level}</option>
                                                        </volist>
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label class="col-lg-2 col-sm-2 control-label"><span style="color:red">*</span>奖项名称</label>
                                            <div class="col-lg-6">
                                                <input class="form-control required prize_name{$k+1}" title="请输入奖项名称" name="name{$k+1}" value="{$item['name']}">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label class="col-lg-2 col-sm-2 control-label"><span style="color:red">*</span>奖项数量</label>
                                            <div class="col-lg-6">
                                                <input class="form-control required prize_number{$k+1}" title="请输入奖项数量" name="number{$k+1}" value="{$item['number']}">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label class="col-lg-2 col-sm-2 control-label"><span style="color:red">*</span>中奖概率(0.00001-100.00000)</label>
                                            <div class="col-lg-6">
                                                <input class="form-control required prize_rate{$k+1}" title="请输入中奖概率" name="reserve{$k+1}" value="{$item['reserve']}">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label class="col-lg-2 col-sm-2 control-label"><span style="color:red">*</span>奖品图片</label>
                                            <div class="col-lg-6">
                                                <img src="{$item['pic']}" class="prize_img{$k+1}" width="100px" height="100px" data-preview="uploadFile{$k+1}">
                                                <input type="file" class="prize_file{$k+1}" name="picurl{$k+1}" data-action="uploadFile{$k+1}">
                                                <if condition="$item['pic'] neq null">
                                                    <input type="hidden" class="prize_pic{$k+1}" name="picurl{$k+1}" value="{$item['pic']}" data-set="uploadFile{$k+1}">
                                                </if>
                                            </div>
                                        </div>
                                    </div>
                                </volist>
                            </div>
                        </div>
                    </section>
                    <div class="form-group">
                        <div class="col-lg-offset-2 col-lg-10">
                            <button class="btn btn-primary" type="submit" id="submit">提交</button>
                            <button class="btn btn-default" type="button" onclick="history.back(-1);">取消</button>
                        </div>
                    </div>
                </form>
            </div>
        </section>
    </div>
</div>
<script type="text/javascript" src="/Public/js/common.upload.js"></script>
<script type="text/javascript">
    common.upload.img.init();

    $("#myTab a:first").tab('show');

    $('#myTab a').click(function (e) {
        e.preventDefault();
        $(this).tab('show');
    })

    function addPrize(){
        var prize_num = parseInt($("#prize_tab li").length) + 1;
        var data = <?php echo json_encode($levels);?>;
        var level_html = "";
        if(prize_num <= 10){
            $("input[name=prize_num]").val(prize_num);
            $("#prize_tab li").removeClass('active');
            $("#prize_tab").append('<li class="active" data-id="'+prize_num+'"><a href="#prize'+prize_num+'" data-item="" data-toggle="tab">奖项'+prize_num+'</a></li>');
            $("#prize_content .tab-pane").removeClass('active');
            for(var i in data){
                var d = data[i];
                level_html += "<option value='"+i+"'>"+d+"</option>";
            }
            $("#prize_content").append('<div class="tab-pane active" id="prize'+prize_num+'">'+
                '<input type="hidden" class="prize_item'+prize_num+'" name="item_id'+prize_num+'" value="">'+
                '<div class="form-group">'+
                    '<label class="col-xs-12 col-sm-3 col-md-2 control-label"><span style="color:red">*</span>奖项等级</label>'+
                    '<div class="col-sm-6 col-xs-12">'+
                        '<div class="form-control-static">'+
                            '<select name="level'+prize_num+'" class="form-control prize_level'+prize_num+'">'+level_html+'</select>'+
                        '</div>'+
                    '</div>'+
                '</div>'+
                '<div class="form-group">'+
                    '<label class="col-lg-2 col-sm-2 control-label"><span style="color:red">*</span>奖项名称</label>'+
                    '<div class="col-lg-6">'+
                        '<input class="form-control required prize_name'+prize_num+'" title="请输入奖项名称" name="name'+prize_num+'">'+
                    '</div>'+
                '</div>'+
                '<div class="form-group">'+
                    '<label class="col-lg-2 col-sm-2 control-label"><span style="color:red">*</span>奖项数量</label>'+
                    '<div class="col-lg-6">'+
                        '<input class="form-control required prize_number'+prize_num+'" title="请输入奖项数量" name="number'+prize_num+'">'+
                    '</div>'+
                '</div>'+
                '<div class="form-group">'+
                    '<label class="col-lg-2 col-sm-2 control-label"><span style="color:red">*</span>中奖概率(0.00001-100.00000)</label>'+
                    '<div class="col-lg-6">'+
                        '<input class="form-control required prize_rate'+prize_num+'" placeho="请输入中奖概率" name="reserve'+prize_num+'">'+
                    '</div>'+
                '</div>'+
                '<div class="form-group">'+
                    '<label class="col-lg-2 col-sm-2 control-label"><span style="color:red">*</span>奖项图片</label>'+
                    '<div class="col-lg-6">'+
                        '<img src="" class="prize_img'+prize_num+'" width="100px" height="100px" data-preview="uploadFile'+prize_num+'">'+
                        '<input name="picurl'+prize_num+'" class="prize_file'+prize_num+'" type="file" data-action="uploadFile'+prize_num+'">'+
                    '</div>'+
                    '</div>'+
                '</div>');
            common.upload.img.init();
        }else{
            alert('最多添加10个奖项！');
        }
    }

    function deletePrize(){
        if(!confirm('确认删除该奖项吗？')) return false;
        var prize_num = parseInt($("#prize_tab li").length);
        if(prize_num > 1){
            //删除奖项表记录
            var item_id = $('#prize_tab .active a').attr('data-item');
            if(item_id){
                $.ajax({
                    data: {id: item_id},
                    dataType: 'json',
                    url: '/User/Niudan/deletePrize',
                    type: 'get',
                    success: function (res) {}
                });
            }
            //改变name属性
            var index = $("#prize_tab .active").index();
            var position = index + 1;
            for(var i=position; i<= prize_num; i++){
                var k = i + 1;
                $("#prize_tab li").eq(i).find("a").html("奖项"+i);
                $(".prize_level"+k).attr("name", "level"+i);
                $(".prize_name"+k).attr("name", "name"+i);
                $(".prize_number"+k).attr("name", "number"+i);
                $(".prize_rate"+k).attr("name", "reserve"+i);
                $(".prize_img"+k).attr("data-preview", "uploadFile"+i);
                $(".prize_file"+k).attr("data-action", "uploadFile"+i).attr("name", "picurl"+i);
                $(".prize_pic"+k).attr("data-set", "uploadFile"+i).attr("name", "picurl"+i);
                $(".prize_item"+k).attr("name", "item_id"+i);
            }
            $("input[name=prize_num]").val(prize_num-1);
            $("#prize_tab .active").remove();
            $("#prize_tab li:last").addClass('active');
            $("#prize_content .tab-pane.active").remove();
            $("#prize_content .tab-pane:last").addClass('active');
            common.upload.img.init();
        }else{
            alert('抱歉无法删除，奖项至少保留一个');
        }
    }

    function checkPrize(){
        var ret = true;
        $(".required").each(function() {
            if($(this).val() == ""){
                ret = false;
                alert("请填写奖项信息完整");
                return false;
            }
        });
        if(ret){
            $("img").each(function() {
                if($(this).attr("src") == ""){
                    ret = false;
                    alert("请填写奖项信息完整");
                    return false;
                }
            });
        }
        return ret;
    }
</script>